<template>
  <div class="patient-rule">
    <div class="contnet">
      <p class="contitle">套餐规则</p>
      <div class="conleft">
        <el-select v-model="packgeValue" style="width: 200px" placeholder="请选择自建规则" :disabled="isDisablePg">
          <el-option v-for="item in packageRuleArr" :key="item.id" :label="item.ruleName" :value="item.id">
          </el-option>
        </el-select>
      </div>
      <div class="conright">
        <el-checkbox v-model="packgeCheck" label="使用系统规则" border style="width: 200px" @change="changePg"></el-checkbox>
      </div>
    </div>
    <div class="contnet">
      <p class="contitle">产品规则</p>
      <div class="conleft">
        <el-select v-model="productValue" style="width: 200px" placeholder="请选择自建规则" :disabled="isDisablePd">
          <el-option v-for="item in productRuleArr" :key="item.id" :label="item.ruleName" :value="item.id">
          </el-option>
        </el-select>
      </div>
      <div class="conright">
        <el-checkbox v-model="productCheck" label="使用系统规则" border style="width: 200px" @change="changePd"></el-checkbox>
      </div>
    </div>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="ruleSubmit">确认</el-button>
      <el-button @click="close(false)">取消</el-button>
    </div>
  </div>
</template>

<script>
// 获取字典
import { queryOper, queryPatientPut } from '@/api/operPatient';
import { crud } from '@crud/crud';
export default {
  mixins: [crud()],
  data() {
    return {
      packageRuleArr: [],
      productRuleArr: [],
      packgeValue: '',
      productValue: '',
      // 初始化可编辑自建规则
      isDisablePg: false,
      isDisablePd: false,
      // 不可编辑系统规则
      packgeCheck: false,
      productCheck: false
    };
  },
  mounted() {
    this.initRes();
  },
  methods: {
    initRes() {
      // 套餐规则-自建规则
      queryOper('packageRule/query', {
        packageRuleType: '02',
        pageIndex: 0,
        pageSize: 999
      }).then((res) => {
        this.packageRuleArr = res.content;
      })
        .catch((er) => {});
      // 产品规则-自建规则
      queryOper('productRule/query', {
        packageRuleType: '02',
        pageIndex: 0,
        pageSize: 999
      }).then((res) => {
        this.productRuleArr = res.content;
      })
        .catch((er) => {});
    },
    close(v) {
      this.$emit('closeDialog', v);
    },
    changePg(val) {
      this.isDisablePg = val;
      this.packgeValue = '';
    },
    changePd(val) {
      this.isDisablePd = val;
      this.productValue = '';
    },
    ruleSubmit() {
      const ids = this.crud.selections.map((item) => {
        return item.id;
      });
      if (this.packgeCheck === false && this.packgeValue === '') {
        this.$message({
          message: '请选择套餐规则！',
          type: 'warning'
        });
        return;
      }
      if (this.productCheck === false && this.productValue === '') {
        this.$message({
          message: '请选择产品规则！',
          type: 'warning'
        });
        return;
      }
      const pgId = this.packgeCheck === true ? -1 : this.packgeValue;
      const pdId = this.productCheck === true ? -1 : this.productValue;
      const params = {
        patientIds: ids,
        patientPackageRuleId: pgId,
        patientProductRuleId: pdId
      };
      queryPatientPut('updateRules', params)
        .then((res) => {
          this.crud.editSuccessNotify();
          this.close(true);
        })
        .catch((er) => {});
    }
  }
};
</script>
<style scoped lang='scss'>
.patient-rule {
  > .contnet {
    overflow: hidden;
    padding: 0 42px 20px;
  }
  .contitle {
    padding-left: 6px;
    border-left: 3px #508fcc solid;
    color: #333;
  }
  .conleft {
    float: left;
    margin-right: 72px;
  }
  .conright {
    float: left;
  }
}
</style>
